/**
 * Created by Eenie on 2016/12/11.
 */


import React, {Component} from 'react';
import TabNavigator from 'react-native-tab-navigator';
import {Text, Image, StyleSheet,
View} from 'react-native';

import Login from './Login';
import Article from '../components/Article';


export default class Home extends Component {


    constructor(props) {

        super(props);
        this.state = {
            selectedTab: 'home'
        };

    }

    render() {
        return (<View needsOffscreenAlphaCompositing
                      renderToHardwareTextureAndroid
                      style={styles.container}>

                <TabNavigator>
                    <TabNavigator.Item
                        selected={this.state.selectedTab === 'home'}
                        title="文章"
                        renderIcon={() => <Image source={require('../images/ic_article_normal.png')} style={styles.tabIcon} />}
                        renderSelectedIcon={() => <Image style={styles.tabIcon} source={require('../images/ic_article_selected.png')} />}
                        onPress={() => this.setState({ selectedTab: 'home' })}>
                        <Article></Article>
                    </TabNavigator.Item>
                    <TabNavigator.Item
                        selected={this.state.selectedTab === 'meizi'}
                        title="福利"
                        renderIcon={() => <Image source={require('../images/ic_girl_normal.png')} style={styles.tabIcon} />}
                        renderSelectedIcon={() => <Image style={styles.tabIcon} source={require('../images/ic_gir_selected.png')} />}
                        onPress={() => this.setState({ selectedTab: 'meizi' })}>
                        <Text>MEIZI</Text>
                    </TabNavigator.Item>
                    <TabNavigator.Item
                        selected={this.state.selectedTab === 'me'}
                        title="我的"
                        renderIcon={() => <Image source={require('../images/ic_me_normal.png')} style={styles.tabIcon} />}
                        renderSelectedIcon={() => <Image style={styles.tabIcon} source={require('../images/ic_me_selected.png')} />}
                        onPress={() => this.setState({ selectedTab: 'me' })}>
                        <Login>

                        </Login>
                    </TabNavigator.Item>
                </TabNavigator>
            </View>


          );
    }


};


const styles = StyleSheet.create({
    tabIcon: {
        width: 25,
        height: 25,
    },
    container: {
        flex: 1,
        backgroundColor: '#252528'
    },
})
